import React from 'react';
import {Layout} from 'antd';
import './index.less';
import {connect} from "dva";
import BaseComponent from "components/Base/BaseComponent";
import AMap from "components/AMap";
import {Marker} from "react-amap";

const {Content, Footer, Header} = Layout;

@connect(({dmap}) => ({dmap}))
export default class extends BaseComponent {

  getNamespace() {
    return 'dmap';
  }

  componentDidMount() {
    this.dispatch({
      type: `${this.getNamespace()}/init`,
      payload: {
        notice: this.showMsg
      },
    })
  }

  render() {

    const {markerPositions} = this.getModel(this.getNamespace());

    const mapProps = {
      zoom: 4,
    };

    return (
      <div className="map">
        <AMap {...mapProps}>
          {
            markerPositions.map(position => {
              return (<Marker position={{...position}} />);
            })
          }
        </AMap>
      </div>
    );
  }

}
